<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>开屏广告编辑</title>
<#include "/WEB-INF/content/module-edit.html">
<script src="${request.contextPath}/res/kindeditor/kindeditor.js"></script>
<script src="${request.contextPath}/res/kindeditor/lang/zh_CN.js"></script>
<script type="text/javascript">
var jumpTypeValue = [
    {"id":"1","text":"url"},
    {"id":"2","text":"原生界面"}
];
var isEnableValue=[
	{"id":"0","text":"不可用"},
	{"id":"1","text":"可用"}
];
var platValue=[
    {"id":"0","text":"自有平台"},
   	{"id":"1","text":"三方平台"}
];
var editor;
KindEditor.ready(function(K){
	editor=K.editor({
		allowFileManager : true
	});
});
$(function(){
	init();
 });
function init(){
	loadPlug();
}
 function sub(){
	var width=${map.width!0};
	var height=${map.height!0};
	if (!$("#form").form('validate'))
		return;
	if(width != 0 && height != 0){
		if($("#width").val()==width){
			if($("#height").val()==height){
			}else{
				top.showMsg("图片高度不等于"+height+"像素");
				return;
			}
		}else{
			top.showMsg("图片宽度不等于"+width+"像素");
			return;
		}
	}
	save(); 
}
 
 function loadPlug(){
		$("#upload").click(function(){
	 		editor.loadPlugin('image', function() {
	 			editor.plugin.imageDialog({
	 				showRemote:false,
	 				imageUrl : $('#imgurl').val(), //如果图片路径框内有内容直接赋值于弹出框的图片地址文本框
	 				//点击弹窗内”确定“按钮所执行的逻辑
	 				clickFn : function(url, title, width, height, border, align) {//经过处理返回的Url是图片地址,width宽度，height高度,align是图片尺寸
	 					$("#width").val(width);
	 					$("#height").val(height);
	 					$('#imgurl').val(url);//获取图片地址
		 				$("#show").attr("src","${map.imgPath!}"+url);
	 					editor.hideDialog(); //隐藏弹窗
	 				}
	 			});
			});	
		});
	  	$("#jumpType").combobox({
	  		valueField : 'id',
	  		textField : 'text',
	  		editable:true,
	  		data:jumpTypeValue
	  	}); 
	  	$("#isEnable").combobox({
	  		valueField : 'id',
	  		textField : 'text',
	  		editable:true,
	  		data:isEnableValue
	  	});
	  	$("#plat").combobox({
	  		valueField : 'id',
	  		textField : 'text',
	  		editable:true,
	  		data:platValue
	  	});
	  	$("#imgurl").validatebox({
	  		required:true
	  	});
	}
</script>
<style>
.input-width{
	width: 95%;
}
</style>
 
</head>
<body class="easyui-layout">
	<div region="north" id="toolbar" style="background-color: #eee; padding: 5px; overflow: hidden;" border="false">
		<#if object.id?exists&&object.id!="">
			<@auth code="ad:info:update">
				<a href="javascript:void(0);" class="easyui-linkbutton" plain="true" iconCls="icon-add" style="border: 1px solid #ccc" onclick="javascript:sub()">保存</a>
			</@auth>
		<#else>
			<@auth code="ad:info:create">
				<a href="javascript:void(0);" class="easyui-linkbutton" plain="true" iconCls="icon-add" style="border: 1px solid #ccc" onclick="javascript:sub()">保存</a>
			</@auth>
		</#if>
		<a href="javascript:void(0);" class="easyui-linkbutton" plain="true" iconCls="icon-edit" style="border: 1px solid #ccc" onclick="javascript:cancel()">关闭</a>
	</div>
	<div region="center">
		<div id="p" class="easyui-panel" style="background: #fafafa; padding: 10px" fit="true" toolbar="#toolbar">
			<form id="form" method="post">
				<table class="form" cellspacing="0" style="width: 100%">
					<tbody style="border: 1px solid #ccc">
						<tr style="display: none;">
							<td colspan="6"><input id="_id" name="id" value="${(object.id)!}"></td>
						</tr>
						<tr>
							<td class="label">广告名称：</td>
							<td>
								<input id="title" name="title" class="easyui-validatebox" required="true" value="${(object.title)!}"/>
							</td>
							<td class="validate">*</td>
							<td class="label">跳转类型：</td>
							<td><input id="jumpType" name="jumpType" required="true" value="${object.jumpType!1}" /></td>
							<td class="validate">*</td>	
						</tr>
						<tr style="height:230px;">
							<td class="label">广告图片上传:</td>
							<td>
								<a href="#" class="easyui-linkbutton" id="upload" style="margin-left:200px;">开始上传</a>
								<input id="width" type="hidden"/><input id="height" type="hidden"/>
							</td>
							<td class="validate">*</td>
							<td class="label">展示图预览:</td>
							<td>
								<img src="${map.imgPath!}${(object.imgurl)!}" style="width:100%;height:200px;" id="show"/>
								<input class="easyui-validatebox" required="true" value="${(object.imgurl)!}" id="imgurl" name="imgurl" style="width:90%;" readonly="readonly"/>
							</td>
							<td class="validate">*</td>								
						</tr>
						<tr>
							<td class="label">是否可用：</td>
							<td><input id="isEnable" name="isEnable" required="true" value="${object.isEnable!'1'}"></td>
							<td class="validate">*</td>						
							<td class="label">平台：</td>
							<td><input id="plat" name="plat" required="true" value="${object.plat!'0'}" /></td>
							<td class="validate">*</td>
						</tr>
						<tr>
							<td class="label">跳转地址：</td>
							<td>
								<input style="width:100%;" id="linkuri" name="linkuri" class="easyui-validatebox"" required="true" value="${(object.linkuri)!}"/>
							</td>
							<td class="validate">*</td>
						</tr>
						<tr>
							<td class="label">广告内容：</td>
							<td colspan="4"><textarea style="width:90%;" id="content" name="content" class="easyui-validatebox" required="true">${(object.content)!}</textarea></td>
							<td class="validate">*</td>
						</tr>
						<tr>
							<td class="label">自定义配置：</td>
							<td colspan="4"><textarea style="width:90%;" id="customCofig" name="customCofig" class="easyui-validatebox">${(object.customCofig)!}</textarea></td>
							<td class="validate"></td>
						</tr>
					</tbody>
				</table>
			</form>
		</div>
	</div>
</body>
</html>